<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
        <title>FileBox App</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script type="text/javascript" src="/static/js/jquery.min.js"></script>
        <script type="text/javascript" src="/static/js/jquery.json-1.3.js"></script>
        <script type="text/javascript" src="/static/js/jquery.history.js"></script>
        <script type="text/javascript" src="/get/application/jquery.pretty.js"></script>
        <script type="text/javascript" src="/get/application/app.js"></script>
        <link rel="stylesheet" href="/get/application/app.css" type="text/css" media="screen"/>
    </head>
    <body>
        <div id="wrapper">
            <div class="inner">
                <noscript>
                    <div id="unsupported">
                        <h1 id="mainTitle">FileBox</h1>
                        <p class="noscript">You must have javascript enabled for this application.</p>
                    </div>
                </noscript>
                <h1 id="mainTitle"></h1>
                <div id="tabNav">
                    <ul>
                        <li id="homeTab" class="selected"><a href="#home">Home</a></li>
                        <li id="uploadTab"><a href="#upload">Add a File</a></li>
                        <li id="settingsTab"><a href="#settings">Settings</a></li>
                    </ul>
                </div>
            </div>

            <!-- SCREENS -->
            <div id="homeScreen" class="screen">
                <div class="inner">
                    <div id="none">
                        <p>No files. <span class="admin"><a href="#upload">Click here to add a file</a></span></p>
                    </div>
                    <div id="pager">
                        <p>Page: <span>1/1</span></p>
                        <ul>
                            <li class="template"><a href="#home:1">1</a></li>
                        </ul>
                    </div>
                    <table id="files">
                        <tr id="homeTemplate" class="template">
                            <td class="file">
                                <a href="#id" target="_top"><!-- file --></a>
                            </td>
                            <td class="size">
                                <p><!-- size --></p>
                            </td>
                            <td class="metadata">
                                <p class="updated"><!-- created --></p>
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
            <div id="uploadScreen" class="screen">
                <form id="uploadForm" action="" method="post" enctype="multipart/form-data" target="uploadTarget">
                    <div class="formWrapper">
                        <input type="hidden" name="extended_ret" value="1"/>
                        <dl>
                            <dt><label for="value">File <abbr title="required field">*</abbr></label></dt>
                            <dd><input name="value" id="value" type="file" class="text" /></dd>

                            <dt><label for="title">Title <abbr title="required field">*</abbr></label></dt>
                            <dd><input name="title" id="title" type="text" class="text" size="30"/></dd>

                            <dd class="buttons"><input type="submit" class="submit" value="Upload" /></dd>
                        </dl>
                    </div>
                </form>
                <iframe id="uploadTarget" class="formFrame" name="uploadTarget" src="" width="0" height="0"></iframe>                 
            </div>
            <div id="settingsScreen" class="screen">
                <form id="settingsForm" action="" method="post">
                    <div class="formWrapper">
                        <dl>
                            <dt><label for="albumTitle">Title <abbr title="required field">*</abbr></label></dt>
                            <dd><input name="value" id="albumTitle" type="text" class="text" size="30"/></dd>

                            <dt class="group"><label for="enableEditor">Allow editors to upload</label></dt>
                            <dd class="group"><input name="enableEditor" id="enableEditor" type="checkbox" class="checkbox" value="yes"/></dd>
                            <dd class="buttons"><input type="submit" class="submit" value="Submit" /></dd>
                        </dl>
                    </div>
                </form>
            </div>
            <div id="loading">
                <p>Loading...</p>
            </div>
            <div id="error">
                <h3>An Error has Occurred</h3>
                <div class="inner">
                    <p class="message"><!-- message --></p>
                    <p class="ok">
                        <a href="#noop">OK</a>
                    </p>
                </div>
            </div>
        </div>
    </body>
</html>

